<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #show{
            width:500px;
            height:50px;
            border: 2px solid blue;
        }
    </style>
</head>
<body>


<div id="show">
    <?php

    if(isset($_GET['x'])&&isset($_GET['cs'])&&isset($_GET['y'])){
        $x = $_GET['x'];
        $cs = $_GET['cs'];
        $y = $_GET['y'];

        switch ($cs){
            case '+':
                echo $x+$y;
                break;
            case '-':
                echo $x-$y;
                break;
            case '*':
                echo $x*$y;
                break;
            case '/':
                echo $x/$y;
                break;
        }
    }

    ?>
</div>
<form action="">
    <input type="button" value="1" class="num">
    <input type="button" value="2" class="num">
    <input type="button" value="3" class="num">
    <input type="button" value="4" class="num">
    <input type="button" value="5" class="num">
    <input type="button" value="6" class="num">
    <input type="button" value="7" class="num">
    <input type="button" value="8" class="num">
    <input type="button" value="9" class="num">
    <input type="button" value="0" class="num">

    <br><br>
    <input type="button" value="+" class="charset">
    <input type="button" value="-" class="charset">
    <input type="button" value="*" class="charset">
    <input type="button" value="/" class="charset">
    <br><br>

    <input type="submit" value="计算！">

    <br><br><br>
    <!--隐藏域-->
    <input type="text" name="x" class="x">
    <input type="text" name="cs" class="cs">
    <input type="text" name="y" class="y">

</form>


<script src="jquery-1.11.3.min.js"></script>
<script>

    var sta = 1;//1对应没按符号之前的状态

//    给数字按钮加单击事件
$('.num').click(function(){
    if (sta==1) {
//      获得当前xinput中已有的内容
        var x = $('.x').val();
//    拼接新的value值
        var newval = x+$(this).val();
//    将新值赋值回去
        $('.x').val(newval);
    }

    if (sta==2) {
//      获得当前xinput中已有的内容
        var x = $('.y').val();
//    拼接新的value值
        var newval = x+$(this).val();
//    将新值赋值回去
        $('.y').val(newval);
    }

//    将x charset y input的内容拼接在一起写入showdiv
    $('#show').html($('.x').val()+$('.cs').val()+$('.y').val());

})


//    给符号按钮加单击事件
    $('.charset').click(function(){
//        将cs input的值改成当前被点击的按钮的值
        $('.cs').val($(this).val());
        sta = 2;
        $('#show').html($('.x').val()+$('.cs').val()+$('.y').val());
    })


</script>




</body>
</html>